<template>
	<view class="login-container">
		<!-- 提示登录的图标 -->
		<uni-icons type="contact-filled" size="100" color="#AFAFAF"></uni-icons>
		<!-- 登录按钮 -->
		<button type="primary" class="btn-login" @click="getUserProfile">一键登录</button>
		<!-- 登录提示 -->
		<view class="tips-text">登录后尽享更多权益</view>
	</view>
</template>

<script>
	import {
		mapMutations,mapState
	} from 'vuex'

	export default {
		name: "my-login",
		data() {
			return {

			};
		},
		computed:{
			...mapState('user',['redirectInfo'])
		},
		methods: {
			...mapMutations('user', ['updateUserInfo','updateToken','updateRedirectInfo']),
			async getUserProfile(e) {
				try {
					// 1. 获取用户信息
					const profileRes = await this.getUserProfileInfo();
					// 2. 获取登录凭证
					const loginRes = await uni.login({
						provider: 'weixin'
					});
					// 3. 构建请求参数
					const params = {
						code: loginRes.code,
						rawData: profileRes.rawData,
						signature: profileRes.signature,
						encryptedData: profileRes.encryptedData,
						iv: profileRes.iv
					};
					// 4. 更新本地用户信息
					this.updateUserInfo(profileRes.userInfo);
					// 5. 调用后端登录接口
					this.loginToBackend(params);
				} catch (error) {
					this.handleLoginError(error);
				}

			},
			async getUserProfileInfo() {
				return new Promise((resolve, reject) => {
					uni.getUserProfile({
						desc: '用于完善会员信息',
						lang: 'zh_CN',
						success: resolve,
						fail: reject
					});
				});
			},
			async loginToBackend(params) {
				// console.log(params)
				try {
					const {
						data: loginResult
					} = await uni.$http.post('/api/public/v1/users/wxlogin', params)
					// console.log(loginResult)
					uni.$showMsg('登录成功');
					this.updateToken("Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1aWQiOjIzLCJpYXQiOjE1NjQ3MzAwNzksImV4cCI6MTAwMTU2NDczMDA3OH0.YPt-XeLnjV-_1ITaXGY2FhxmCe4NvXuRnRB8OMCfnPo")
					this.navigateBack()
					
					// if (loginResult.meta.status === 200) {
					// 	uni.$showMsg('登录成功');
					// 	// 处理登录成功逻辑，如保存token等
					// 	// this.updateToken(loginResult.message.token)
						
					// } else {
					// 	uni.$showMsg('登录失败: ' + loginResult.meta.msg);
					// 	 this.updateToken('123')
					// }
				} catch (err) {
					console.error('后端请求失败:', err);
					uni.$showMsg('服务器连接失败');
				}
			},
			handleLoginError(error) {
				if (error.errMsg.includes('deny')) {
					uni.$showMsg('您取消了登录授权');
				} else {
					console.error('登录错误:', error);
					uni.$showMsg('登录过程出错');
				}
			},
			navigateBack(){
				if(this.redirectInfo && this.redirectInfo.openType === 'switchTab'){
					uni.switchTab({
						url: this.redirectInfo.from,
						complete: () => {
							this.updateRedirectInfo(null)
						}
					})
				}
			}

		}

	}
</script>

<style lang="scss">
	.login-container {
		height: 750rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		background-color: #f8f8f8;
		position: relative;
		overflow: hidden;

		&::after {
			content: '';
			display: block;
			width: 100%;
			height: 40px;
			background-color: white;
			position: absolute;
			bottom: 0;
			left: 0;
			border-radius: 100%;
			transform: translateY(50%);
		}


		.btn-login {
			width: 90%;
			border-radius: 100px;
			margin: 15px 0;
			background-color: #F21010;
		}

		.tips-text {
			font-size: 12px;
			color: gray;
		}
	}
</style>